<!DOCTYPE html>
<html lang="en">

<head>
    <!-- 有一个table元素，它有101行，一共有10种颜色，请手写css代码使得table的1-10行的背景是这10中颜色，11-20行重复这10中颜色，以此类推。 -->
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        table,
        tr,
        td {
            width: 200px;
            height: 5px;
            border: 1px solid blue;
        }
        /* 
        nth-child(2)规定属于其父元素的第二个子元素的每个 p 的背景色,而不是自身的子元素，这个要注意
        p:nth-child(2)
          {
          background:#ff0000;
          }
         */
        
        tr:nth-child(10n+1) {
            background-color: blue;
        }
        
        tr:nth-child(10n+2) {
            background-color: red;
        }
        
        tr:nth-child(10n+3) {
            background-color: skyblue;
        }
    </style>
</head>

<body>
    <table id="tb">
        <tr id="first">
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
        <tr>
            <td>11</td>
        </tr>
    </table>
</body>

</html>